import React, { Component, Fragment } from 'react';
import Loadable from 'react-loadable';
import {BrowserRouter as Router, Route, Switch} from 'react-router-dom';
import BasicLayout from './Layout/BasicLayout';
import { Layout } from 'antd';
const { Content } = Layout;
import Loading from './components/Loading/Loading';
import MainMenu from './components/MainMenu/MainMenu';
import './style.less';

const Home = Loadable({
    loader: () => import('./routes/Home/Home'),
    loading: Loading,
});


const WebUser = Loadable({
    loader: () => import('./routes/UserManagement/WebUser/WebUser'),
    loading: Loading,
});

const RoleManagement = Loadable({
    loader: () => import('./routes/UserManagement/RoleManagement/RoleManagement'),
    loading: Loading,
});

const Login = Loadable({
    loader: () => import('./routes/Login/Login'),
    loading: Loading,
});

const OperateLog = Loadable({
    loader: () => import('./routes/Log/OperateLog/OperateLog'),
    loading: Loading,
});

const Druid = Loadable({
    loader: () => import('./routes/Log/Druid'),
    loading: Loading,
});
const Youmeng = Loadable({
    loader: () => import('./routes/Log/Youmeng'),
    loading: Loading,
});

const ModPwd = Loadable({
    loader: () => import('./routes/Settings/ModPwd/ModPwd'),
    loading: Loading,
});

//河长信息
const HezhangInfo = Loadable({
    loader: () => import('./routes/RiverLakeInfo/HezhangInfo/HezhangInfo'),
    loading: Loading,
});

//河流信息
const RiverInfo = Loadable({
    loader: () => import('./routes/RiverLakeInfo/RiverInfo/RiverInfo'),
    loading: Loading,
});

//水库信息
const ReservoirInfo = Loadable({
    loader: () => import('./routes/RiverLakeInfo/ReservoirInfo/ReservoirInfo'),
    loading: Loading,
});

//湖泊信息
const LakeInfo = Loadable({
    loader: () => import('./routes/RiverLakeInfo/LakeInfo/LakeInfo'),
    loading: Loading,
});

//公告牌信息
const BulletinBoard = Loadable({
    loader: () => import('./routes/RiverLakeInfo/BulletinBoard/BulletinBoard'),
    loading: Loading,
});

//系统设置
const SysSettings = Loadable({
    loader: () => import('./routes/Settings/SysManagement/SysSettings/SysSettings'),
    loading: Loading,
});

//菜单设置
const MenuManagement = Loadable({
    loader: () => import('./routes/Settings/MenuManagement/MenuManagement'),
    loading: Loading,
});

//行政区划设置
// const WorkingDynamics = Loadable({
//     loader: () => import('./routes/Settings/SysSettings/AdministrativeDivision/AdministrativeDivision'),
//     loading: Loading,
// });

//通知公告
const Notice = Loadable({
    loader: () => import('./routes/ContentManagement/Notice/Notice'),
    loading: Loading,
});

const routes = [
    {
        path: "/",
        main: Home,
        side: () => <MainMenu />
    },
    {
        path: "/base/riverChief",
        main: HezhangInfo,
        side: () => <MainMenu />
    },
    {
        path: "/base/rivers",
        main: RiverInfo,
        side: () => <MainMenu />
    },
    {
        path: "/base/reservoir",
        main: ReservoirInfo,
        side: () => <MainMenu />
    },
    {
        path: "/base/lake",
        main: LakeInfo,
        side: () => <MainMenu />
    },
    {
        path: "/base/bulletinBoard",
        main: BulletinBoard,
        side: () => <MainMenu />
    },
    {
        path: "/system/system",
        main: SysSettings,
        side: () => <MainMenu />
    },
    // {
    //     path: "/system/system",
    //     main: SysSettings,
    //     side: () => <MainMenu />
    // },
    {
        path: "/content/notice",
        main: Notice,
        side: () => <MainMenu />,
        name: "通知公告"
    },
    {
        path: "/system/user/menu",
        main: MenuManagement,
        side: () => <MainMenu />,
        name: "菜单设置"
    },
    {
        path: "/user/getAll",
        main: WebUser,
        side: () => <MainMenu />,
        name: "平台用户"
    },
    {
        path: "/user/getRole",
        main: RoleManagement,
        side: () => <MainMenu />,
        name: "角色管理"
    },
    {
        path: "/log/getAll",
        main: OperateLog,
        side: () => <MainMenu />,
        name: "操作日志"
    },
    {
        path: "/log/druid",
        main: Druid,
        side: () => <MainMenu />,
        name: "druid"
    },
    {
        path: "/log/youmeng",
        main: Youmeng,
        side: () => <MainMenu />,
        name: "友盟统计"
    },
    {
        path: "/modifyPassword",
        main: ModPwd,
        side: () => <MainMenu />,
        name: "修改密码"
    },

]




class App extends Component {

    state = {
        now: 1
    }

    constructor(props) {
        super(props);
        routes.push({
            path: "/settings",
            main: () => <Settings now={this.state.now} />,
            side: () => <MainMenu now2={this.state.now} />
        })
    }

    componentDidMount(){

    }

  render() {
      return (
      <Layout className="pageWrap">
            <Router>
                <Switch>
                    <Route path='/login' component={Login} />
                    <Fragment>
                        <BasicLayout>
                            {routes.map( (routes, i) => (
                                <Route exact key={i} path={routes.path} component={routes.side} />
                            ))}
                            <Content>
                                {routes.map( (routes, i) => (
                                        <Route exact key={i} path={routes.path} component={routes.main} />
                                ))}
                            </Content>
                        </BasicLayout>
                    </Fragment>
                </Switch>
            </Router>
      </Layout>
    );
  }
}

export default App;
